{extend name="common/base" /}
{block name="style"}
<link rel="stylesheet" href="__CDN__/html/css/mui.picker.min.css" />
<link rel="stylesheet" href="__CDN__/html/css/mui.poppicker.css"  />
{/block}
{block name="body"}
<div>
    <div class="souye-mains souye-mains2">
        <div class="mui-slider souye-banner">
            <div class="mui-slider-group mui-slider-loop" >
                <!--支持循环，需要重复图片节点-->
                <div class="mui-slider-item mui-slider-item-duplicate "><a href="{$taskInfo['xg_img_head']}"><img src="{$taskInfo['xg_img_head']}" /></a></div>
                <?php foreach($taskInfo['xg_img'] as $val):?>
                <div class="mui-slider-item"><a href="{$val}"><img src="{$val}" /></a></div>
                <?php endforeach;?>
                <!--支持循环，需要重复图片节点-->
                <div class="mui-slider-item mui-slider-item-duplicate"><a href="{$taskInfo['xg_img_end']}"><img src="{$taskInfo['xg_img_end']}" /></a></div>
            </div>
        </div>
        <ul class="souye-nav" style="box-shadow: 0 1px 4px #9a9999;">
            <li>
                <p class="nav-list-ps nav-list-ps2">{$taskInfo['task_title']}</p>
                <div class="nav-list-cen">
                    <span class="cen-span1">
                        <em class="js-time" duration="{$taskInfo['duration']}">0天0时0分</em>后失效
                    </span>
                    <span class="cen-span2">¥{$taskInfo['task_price']}</span>
                </div>
                <div class="nav-list-dib nav-list-dib2">
                    <div class="dib-span">
                        <?php foreach($taskInfo['push_position'] as $val):?>
                        <span class="span-one">{$val}</span>
                        <?php endforeach;?>
                        <span class="span-one span-one2">展示{$taskInfo['show_time']}周</span>
                    </div>
                    <div class="bid-ps">剩<i>{$taskInfo.task_num}</i>个名额</div>
                </div>
            </li>
        </ul>
        <ul class="rwxq-list" style="box-shadow: 0 1px 4px #9a9999;">
            <li class="li1">任务要求</li>
            <li>
                <div class="rwxq-left">品牌要求</div>
                <div class="rwxq-right">{$taskInfo['car_brand_list']}</div>
            </li>
            <li class="li3">
                <div class="rwxq-left">车型要求</div>
                <div class="rwxq-right">{$taskInfo['car_type_list']}</div>
            </li>
            <li>
                <div class="rwxq-left">车身颜色要求</div>
                <div class="rwxq-right">{$taskInfo['car_color_list']}</div>
            </li>  
            <li class="li2 li3">
                <div class="rwxq-left">居住地要求</div>
                <div class="rwxq-right rwxq-rights">{$taskInfo['address_list']}</div>
            </li>  
            <li>
                <div class="rwxq-left">上刊时间</div>
                <div class="rwxq-right rwxq-rights">{$taskInfo['sk_start_time']|date='Y年m月d日',###}-{$taskInfo['sk_end_time']|date='Y年m月d日',###}</div>
            </li>
            <li  class="li3" style="border-bottom:1px solid #F0F0F0;">
                <a href="{:url('index/wdlist')}">
                <div class="rwxq-left">上刊网点</div>
                <div class="rwxq-right">{$positionCount}家网点</div>
                </a>
            </li>                                  
        </ul>
        <div class="rwxq-sm">
            <h2 class="sm-h2">任务说明</h2>
            <p class="rwxq-sm-ps">{$taskInfo['task_desc']}</p>
        </div>
    </div>

    <div class="rwxq-bottom">
        <form action="" method="POST">
            <input type="hidden" id="task_id" name="task_id" value="{$taskInfo['task_id']}" />
            <div class="rwxq-sy">
                <a href="{:url('Pub/ptxy')}">
                    <img src="__CDN__/html/img/btn_selected.png">
                    <span class="sy-span">领取任务即代表您同意《平台协议》</span>
                </a>
            </div>
            <ul class="bott-nav">
                <li class="nav-li1">
                    <a href="tel://{$pt_phone}">
                        <img src="__CDN__/html/img/btn_zixun.png" class="li-img">
                        <div class="li-wz">电话咨询</div>
                    </a>
                </li>
                <?php if($carInfo['car_cert'] == 0):?>
                <li class="nav-li2 js-nav-li" is_show_list="0">
                    <a href="{:url('index/my/noAuth')}">
                    未认证，无法下单 >
                    </a>
                </li>
                <?php elseif($orderInfo):?>
                <a href="{:url('task/detail',['id'=>$orderInfo['order_id']])}"><li class="nav-li2 nav-li3 js-nav-li" is_show_list="0">已领取，查看任务 ></li></a>
                <?php elseif($taskInfo['sk_end_time'] < time()):?>
                <li class="nav-li2 js-nav-li" is_show_list="0">任务已过期 ></li>
                <?php else:?>
                <!-- 正常可领取状态 -->
                <li class="nav-li2 nav-li3 js-nav-li" id="wdPicker" is_show_list="1">
                    立即领取 >
                    <input type="text"  class="nav-sele js-type" readonly="readonly" >
                    <input type="hidden" name="position_id" class="js-type-val">
                </li> 
                <?php endif;?>
            </ul>
        </form>
    </div>
</div>
{/block}
{block name="menu"}{/block}
{block name="script"}
<script src="__CDN__/html/js/mui.picker.min.js"></script>
<script src="__CDN__/html/js/mui.poppicker.js"></script>
<script type="text/javascript">
    
    
    
    $(function(){
        var gallery = mui('.mui-slider');
        gallery.slider({
            interval: 5000//自动轮播周期，若为0则不自动播放，默认为0；
        });

        var is_show_list = $('.js-nav-li').attr('is_show_list');
        if(is_show_list == '1'){
            //-----------------------------------------
            //选择网点
            var wdPicker = new mui.PopPicker();
            wdPicker.setData({$positionList});
            document.querySelector('#wdPicker').addEventListener('tap', function (event) {
                wdPicker.show(function (items) {
                    $('.js-type').val(items[0].text);
                    $('.js-type-val').val(items[0].value);

                    var task_id = $('#task_id').val();
                    var position_id = items[0].value;
                    $.post("{:url('index/addorder')}",{task_id:task_id,position_id:position_id},function(res){
                        setTimeout(function(){
                            //window.location.href = data.url;
                            location.reload();
                        },2000);
                        mui.toast(res.msg);
                    },'json');
                });
            }, false);
        }
        
        var times = $('.js-time').attr('duration');
        countDown(times);
    });
    //带天数的倒计时
    function countDown(times) {
        var timer = {};
        timer = setInterval(function () {
            var day = 0,
                    hour = 0,
                    minute = 0,
                    second = 0;//时间默认值
            if (times > 0) {
                day = Math.floor(times / (60 * 60 * 24));
                hour = Math.floor(times / (60 * 60)) - (day * 24);
                minute = Math.floor(times / 60) - (day * 24 * 60) - (hour * 60);
                second = Math.floor(times) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60);
            }
            if (day <= 9)
                day = '0' + day;
            if (hour <= 9)
                hour = '0' + hour;
            if (minute <= 9)
                minute = '0' + minute;
            if (second <= 9)
                second = '0' + second;
            $('.js-time').text(day + "天" + hour + "时" + minute + "分")
            times--;
        }, 1000);
        if (times <= 0) {
            clearInterval(timer);
        }
    }
</script>
{/block}